{% extends 'base.html' %}

{% block title %}个人信息 - 区块链交易行为特征分析与可视化系统{% endblock %}

{% block content %}
<div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
    <h1 class="h2"><i class="fas fa-user-cog me-2"></i>个人信息</h1>
</div>

<div class="row">
    <!-- 个人信息卡片 -->
    <div class="col-md-6 mb-4">
        <div class="card">
            <div class="card-header bg-primary text-white">
                <h5 class="mb-0"><i class="fas fa-id-card me-2"></i>账户信息</h5>
            </div>
            <div class="card-body">
                <form method="post" action="{{ url_for('profile') }}">
                    <div class="mb-3">
                        <label for="username" class="form-label">用户名</label>
                        <input type="text" class="form-control" id="username" value="{{ user.username }}" readonly>
                        <div class="form-text">用户名不可修改</div>
                    </div>
                    <div class="mb-3">
                        <label for="email" class="form-label">电子邮箱</label>
                        <input type="email" class="form-control" id="email" name="email" value="{{ user.email or '' }}" required>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">注册时间</label>
                        <input type="text" class="form-control" value="{{ user.created_at.strftime('%Y-%m-%d %H:%M:%S') }}" readonly>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">最后登录时间</label>
                        <input type="text" class="form-control" value="{{ user.last_login.strftime('%Y-%m-%d %H:%M:%S') if user.last_login else '首次登录' }}" readonly>
                    </div>
                    <div class="d-grid gap-2">
                        <button type="submit" class="btn btn-primary">
                            <i class="fas fa-save me-2"></i>保存修改
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- 修改密码卡片 -->
    <div class="col-md-6 mb-4">
        <div class="card">
            <div class="card-header bg-warning text-dark">
                <h5 class="mb-0"><i class="fas fa-key me-2"></i>修改密码</h5>
            </div>
            <div class="card-body">
                <form method="post" action="{{ url_for('change_password') }}">
                    <div class="mb-3">
                        <label for="current_password" class="form-label">当前密码</label>
                        <div class="input-group">
                            <span class="input-group-text"><i class="fas fa-lock"></i></span>
                            <input type="password" class="form-control" id="current_password" name="current_password" required>
                        </div>
                    </div>
                    <div class="mb-3">
                        <label for="new_password" class="form-label">新密码</label>
                        <div class="input-group">
                            <span class="input-group-text"><i class="fas fa-key"></i></span>
                            <input type="password" class="form-control" id="new_password" name="new_password" required>
                        </div>
                        <div class="form-text">密码长度至少为6个字符</div>
                    </div>
                    <div class="mb-3">
                        <label for="confirm_password" class="form-label">确认新密码</label>
                        <div class="input-group">
                            <span class="input-group-text"><i class="fas fa-check-double"></i></span>
                            <input type="password" class="form-control" id="confirm_password" name="confirm_password" required>
                        </div>
                    </div>
                    <div class="d-grid gap-2">
                        <button type="submit" class="btn btn-warning">
                            <i class="fas fa-key me-2"></i>修改密码
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- 账户安全提示 -->
<div class="card mb-4">
    <div class="card-header bg-info text-white">
        <h5 class="mb-0"><i class="fas fa-shield-alt me-2"></i>账户安全提示</h5>
    </div>
    <div class="card-body">
        <ul class="list-group list-group-flush">
            <li class="list-group-item">
                <i class="fas fa-check-circle text-success me-2"></i>
                定期更改密码，提高账户安全性
            </li>
            <li class="list-group-item">
                <i class="fas fa-check-circle text-success me-2"></i>
                使用强密码，包含大小写字母、数字和特殊字符
            </li>
            <li class="list-group-item">
                <i class="fas fa-check-circle text-success me-2"></i>
                不要在不同网站使用相同的密码
            </li>
            <li class="list-group-item">
                <i class="fas fa-check-circle text-success me-2"></i>
                保持邮箱信息更新，以便接收重要通知
            </li>
        </ul>
    </div>
</div>
{% endblock %}